import 'package:flutter/material.dart';
import 'nft_collection_screen.dart';
import 'transaction_history_screen.dart';
import 'notification_screen.dart';
import 'help_center_screen.dart';
import 'settings_screen.dart';
import 'package:hrcapp/screens/account_security_screen.dart';
import 'package:hrcapp/screens/identity_verification_screen.dart';

class ProfileScreen extends StatelessWidget {
  const ProfileScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFFF8F9FA),
      appBar: AppBar(
        title: const Text('个人中心'),
        backgroundColor: Colors.white,
        foregroundColor: const Color(0xFF333333),
        elevation: 0,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios, size: 16),
          onPressed: () {
            Navigator.pop(context);
          },
        ),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            // 用户信息卡片
            Container(
              margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
              width: double.infinity,
              height: 160,
              decoration: BoxDecoration(
                color: const Color(0xFF1890FF),
                borderRadius: BorderRadius.circular(16),
              ),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  // 用户头像
                  Padding(
                    padding: const EdgeInsets.only(left: 60, right: 40),
                    child: Container(
                      width: 80,
                      height: 80,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(40),
                      ),
                      child: Container(
                        width: 70,
                        height: 70,
                        margin: const EdgeInsets.all(5),
                        decoration: BoxDecoration(
                          color: const Color(0xFFE6F7FF),
                          borderRadius: BorderRadius.circular(35),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Container(
                              width: 20,
                              height: 20,
                              decoration: BoxDecoration(
                                color: const Color(0xFF40A9FF),
                                borderRadius: BorderRadius.circular(10),
                              ),
                            ),
                            const SizedBox(height: 5),
                            CustomPaint(
                              size: const Size(40, 10),
                              painter: SmilePainter(),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                  
                  // 用户信息
                  Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      const Text(
                        '张三',
                        style: TextStyle(
                          fontSize: 20,
                          fontWeight: FontWeight.bold,
                          color: Colors.white,
                        ),
                      ),
                      const SizedBox(height: 5),
                      const Text(
                        '非遗收藏家',
                        style: TextStyle(
                          fontSize: 14,
                          color: Color(0xFFE6F7FF),
                        ),
                      ),
                      const SizedBox(height: 5),
                      Row(
                        children: [
                          Container(
                            width: 80,
                            height: 24,
                            decoration: BoxDecoration(
                              color: const Color(0xFF40A9FF),
                              borderRadius: BorderRadius.circular(12),
                            ),
                            child: const Center(
                              child: Text(
                                '已认证',
                                style: TextStyle(
                                  fontSize: 12,
                                  fontWeight: FontWeight.bold,
                                  color: Colors.white,
                                ),
                              ),
                            ),
                          ),
                          const SizedBox(width: 10),
                          Container(
                            width: 60,
                            height: 24,
                            decoration: BoxDecoration(
                              color: const Color(0xFF69C0FF),
                              borderRadius: BorderRadius.circular(12),
                            ),
                            child: const Center(
                              child: Text(
                                'ID: 123456',
                                style: TextStyle(
                                  fontSize: 12,
                                  fontWeight: FontWeight.bold,
                                  color: Colors.white,
                                ),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ],
              ),
            ),

            // 功能菜单
            Container(
              margin: const EdgeInsets.symmetric(horizontal: 20),
              width: double.infinity,
              padding: const EdgeInsets.all(20),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(16),
                boxShadow: const [
                  BoxShadow(
                    color: Color(0x1A000000),
                    blurRadius: 20,
                    offset: Offset(0, 4),
                  ),
                ],
              ),
              child: Column(
                children: [
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const AccountSecurityScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '账户安全', 
                      Icons.lock_outline, 
                      const Color(0xFFE6F7FF), 
                      const Color(0xFF1890FF)
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const IdentityVerificationScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '实名认证', 
                      Icons.credit_card_outlined, 
                      const Color(0xFFFFF7E6), 
                      const Color(0xFFFAAD14),
                      badgeText: '已完成',
                      badgeColor: const Color(0xFFF0F2F5),
                      badgeTextColor: const Color(0xFF52C41A)
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const NFTCollectionScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '我的收藏', 
                      Icons.favorite_border, 
                      const Color(0xFFFFF1F0), 
                      const Color(0xFFF5222D),
                      badgeText: '12',
                      badgeColor: const Color(0xFFF0F2F5)
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const TransactionHistoryScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '交易记录', 
                      Icons.swap_vert, 
                      const Color(0xFFF0FFF4), 
                      const Color(0xFF52C41A)
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const NotificationScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '消息通知', 
                      Icons.notifications_none, 
                      const Color(0xFFE6F7FF), 
                      const Color(0xFF1890FF),
                      notificationCount: 3
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const HelpCenterScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '帮助中心', 
                      Icons.help_outline, 
                      const Color(0xFFE6F7FF), 
                      const Color(0xFF1890FF)
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => const SettingsScreen(),
                        ),
                      );
                    },
                    child: _buildMenuItem(
                      context, 
                      '设置', 
                      Icons.settings, 
                      const Color(0xFFF0F2F5), 
                      const Color(0xFF666666)
                    ),
                  ),
                  const SizedBox(height: 10),
                  // 退出登录按钮
                  Container(
                    width: double.infinity,
                    height: 50,
                    decoration: BoxDecoration(
                      color: const Color(0xFFFFF1F0),
                      borderRadius: BorderRadius.circular(8),
                    ),
                    child: const Center(
                      child: Text(
                        '退出登录',
                        style: TextStyle(
                          fontSize: 16,
                          fontWeight: FontWeight.bold,
                          color: Color(0xFFF5222D),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),

            // KYC认证卡片 - 保留用户要求的KYC认证UI部分
            Container(
              margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(12),
                color: const Color(0xFFE6F7FF),
              ),
              padding: const EdgeInsets.all(16),
              child: Row(
                children: [
                  const Icon(
                    Icons.shield, 
                    color: Color(0xFF1890FF), 
                    size: 24,
                  ),
                  const SizedBox(width: 12),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: const [
                        Text('KYC实名认证'),
                        Text('完成实名认证可提升账户安全性')
                      ],
                    ),
                  ),
                  ElevatedButton(
                    onPressed: () {},
                    style: ElevatedButton.styleFrom(
                      backgroundColor: const Color(0xFF1890FF),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(8),
                      ),
                    ),
                    child: const Text('去认证'),
                  ),
                ],
              ),
            ),

            // 版本信息
            const Padding(
              padding: EdgeInsets.only(bottom: 24),
              child: Text(
                'HRC非遗通 v1.0.0',
                style: TextStyle(
                  color: Color(0xFF9E9E9E),
                  fontSize: 12,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildMenuItem(
    BuildContext context,
    String title,
    IconData icon,
    Color iconBgColor,
    Color iconColor,
    {String? badgeText,
    Color badgeColor = const Color(0xFFF0F2F5),
    Color badgeTextColor = const Color(0xFF333333),
    int? notificationCount}
  ) {
    return Container(
      width: double.infinity,
      height: 50,
      decoration: BoxDecoration(
        color: const Color(0xFFF0F2F5),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Row(
        children: [
          // 图标
          Container(
            width: 70,
            height: 50,
            padding: const EdgeInsets.only(left: 20),
            child: Stack(
              children: [
                Container(
                  width: 30,
                  height: 30,
                  decoration: BoxDecoration(
                    color: iconBgColor,
                    borderRadius: BorderRadius.circular(15),
                  ),
                  child: Center(
                    child: Icon(icon, color: iconColor, size: 16),
                  ),
                ),
                // 通知角标
                if (notificationCount != null && notificationCount > 0)
                  Positioned(
                    top: 0,
                    right: 0,
                    child: Container(
                      width: 16,
                      height: 16,
                      decoration: BoxDecoration(
                        color: const Color(0xFFF5222D),
                        borderRadius: BorderRadius.circular(8),
                      ),
                      child: Center(
                        child: Text(
                          notificationCount.toString(),
                          style: const TextStyle(
                            color: Colors.white,
                            fontSize: 10,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                    ),
                  ),
              ],
            ),
          ),
          // 标题
          Text(
            title,
            style: const TextStyle(
              fontSize: 16,
              color: Color(0xFF333333),
            ),
          ),
          const Spacer(),
          // 徽章
          if (badgeText != null)
            Container(
              margin: const EdgeInsets.only(right: 10),
              width: badgeText.length > 2 ? 40 : 30,
              height: 30,
              decoration: BoxDecoration(
                color: badgeColor,
                borderRadius: BorderRadius.circular(6),
              ),
              child: Center(
                child: Text(
                  badgeText,
                  style: TextStyle(
                    fontSize: 12,
                    fontWeight: FontWeight.bold,
                    color: badgeTextColor,
                  ),
                ),
              ),
            ),
          // 箭头
          Container(
            width: 50,
            height: 50,
            child: const Center(
              child: Icon(
                Icons.arrow_forward_ios, 
                size: 14, 
                color: Color(0xFF666666),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

// 绘制微笑表情的自定义画笔
class SmilePainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint()
      ..color = const Color(0xFF40A9FF)
      ..strokeWidth = 3
      ..style = PaintingStyle.stroke
      ..strokeCap = StrokeCap.round;

    final path = Path();
    path.moveTo(size.width * 0.2, size.height * 0.8);
    path.quadraticBezierTo(
      size.width * 0.5, 
      size.height,
      size.width * 0.8, 
      size.height * 0.8
    );
    canvas.drawPath(path, paint);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return false;
  }
}